<!DOCTYPE html>

<html>
	<head>
		<title></title>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
	</head>

	<body style="background-color: #222222" onload="run();" onresize="resize();" oncontextmenu="return false;">
		<!--nunuStudio lib-->
		<script type="text/javascript" src="nunu.min.js"></script>

		<!--App code-->
		<script type="text/javascript">
			var app;

			// Initialize app
			function run()
			{
				// Create app object
				app = new Nunu.App();

				// Onload enable the vr and fullscreen buttons
				var logo = document.getElementById("logo");
				var onLoad = function()
				{
					var button = document.getElementById("fullscreen");
					button.style.visibility = "visible";
					document.body.removeChild(logo);
				};

				// On progress callback
				var bar = document.getElementById("bar");
				var onProgress = function(event)
				{
					if(event.lengthComputable)
					{
						var progress = event.loaded / event.total * 100;
						bar.style.width = progress + "%";
					}
				};

				// Load and run app
				app.loadRunProgram("app.nsp", onLoad, onProgress);
			}

			// Resize app (must be called every time the window is resized)
			function resize()
			{
				app.resize();
			}
		</script>

		<!--Logo-->
		<div id="logo" style="position:absolute; width:50%; left:25%; top:35%">
			<img src="logo.png" style="width:100%;"></img>
			<!--Loading bar-->
			<div style="position:absolute; width:100%; height:7%; left:0%; top:120%; border-style:solid; border-color:#FFFFFF; border-width:2px">
				<div id="bar" style="position:absolute; width:0%; height:100%; left:0%; top:0%; background-color:#FFFFFF">
			</div>
		</div>
	</body>
</html>
